<template>
<HHead></HHead>
  <div class="block text-center">
<!--    展示位-->
    <el-carousel trigger="click" height="200px" class="cd_home main-el-carousel" >
      <el-carousel-item v-for="item in this.other_picture_list" :key="item" class="main-el-carousel-item">
<!--        <h3 class="small justify-center" text="2xl">热门活动</h3>-->
        <img :src="item.src" alt=" " class="main-el-carousel-item-img">
      </el-carousel-item>
    </el-carousel>
<!--    正在进行中-->
    <div class="activity-menu_div" >
    <router-link to="/activities"  class="jq_click">
      <div class="activities">
        正在进行中
      </div>
    </router-link>
    <router-link to="/activityOver"  class="jq_click">
      <div class="active_over">已结束</div>
    </router-link>
  </div>
  </div>
  <router-view v-if="!this.$route.path.endsWith('/activity')"></router-view>
  <div class="activities_over_div" v-else>
    <ul class="activities_over_list">
      <li class="activities_over_one"><img src="	http://img.moehot.com/img/2019/10/24/0010/ZQ4JHQKZT2WH0130B5EE20F4K.jpg" class="activities_img" alt="活动照片"></li>
      <li class="activities_over_one"><img src="		http://img.moehot.com/img/2021/09/26/0000/0PT7E048QC1ZCFW0B7MW0HPAB.jpg" class="activities_img" alt="活动照片"></li>
    </ul>
  </div>
</template>

<script>
import $ from 'jquery'
import HHead from "@/components/HHead";
import {mapState} from 'vuex'
export default {
  name:'activity_maid',
  components: {
    HHead
  },
  computed:{
    ...mapState(['other_picture_list'])
  }
}
$(function (){
  $('.activities').on('mouseout',function (){
    $('.activities').css({
      transition: '1s'
    })
  })
  $('.active_over').on('mouseout',function (){
    $('.active_over').css({
      transition: '1s'
    })
  })
})
</script>
